import Taro, { Component } from "@tarojs/taro";
import { View, Text, Image, RichText } from "@tarojs/components";

import '../../components/issue.less'
import icon_19 from '../../assets/img/icon_19.png'
import icon_20 from '../../assets/img/icon_20.png'
import icon_21 from '../../assets/img/icon_21.png'
import icon_22 from '../../assets/img/icon_22.png'

// 发布页
class Issue extends Component{
  constructor(){
    super()
    this.state = {
      contentShow: false, // 发布窗口是否显示
    }
  }

  componentWillMount(): void {
    Taro.setNavigationBarTitle({title: '发布'})
  }

  handleClick () {
    this.setState({
      contentShow: !this.state.contentShow
    })
  }

  render() {
    return(
      <View>
        {console.log( this.state.contentShow)}
        <View className='btn' onClick={this.handleClick.bind(this)}>控制按钮</View>
        <View className={ this.state.contentShow ? 'issue-wrap issue-wrap-show' : 'issue-wrap' }>
          <View className='content'>
            <View className='item'>
              <Image className='item-icon' src={icon_19} />
              <Text className='item-title'>发布需求</Text>
            </View>
            <View className='item'>
              <Image className='item-icon' src={icon_20} />
              <Text className='item-title'>提供服务</Text>
            </View>
            <View className='item'>
              <Image className='item-icon' src={icon_21} />
              <Text className='item-title'>发布职位</Text>
            </View>
            <View className='item'>
              <Image className='item-icon' src={icon_22} />
              <Text className='item-title'>发布简历</Text>
            </View>
          </View>
        </View>
      </View>
    )
  }
}

export default Issue
